import { useState } from 'react';
import { getData5 } from '../Data'
import { useMount } from 'ahooks';
import { FlexGrid } from "@grapecity/wijmo.react.grid";
import { CellRange } from "@grapecity/wijmo.grid";

import { CollectionView } from "@grapecity/wijmo";

const WijmoH01 = () => {

    const [Data, setData] = useState()
    useMount(() => {
        setData(new CollectionView(getData5(100), {
            sortDescriptions: ["country", "product"],   // 排序组合
            groupDescriptions: ["country", "product"]   // 分组组合
        }))
    })

    const init = (init) => {
        init.select(new CellRange(5, 8), true);  // 程序选中
    }


    if (Data) {
        return (
            <div className="Page">
                <FlexGrid
                    initialized={init}
                    itemsSource={Data}
                />
            </div>
        );
    }
};

export default WijmoH01